<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"> 

    <h:head>
        <h:outputStylesheet name="screen.css" library="css"/>
        <h:outputStylesheet name="parallax.css" library="css"/>
        
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
        
        
        <script src="resources/javascript/ga.js" async="" type="text/javascript"></script>
        <script src="resources/javascript/jquery-1.js"></script>
        <script src="resources/javascript/jquery-ui-1.js"></script>
        <script src="resources/javascript/js.js"></script>
      
    </h:head>
    
    <h:body>
    
        <script type="text/javascript">
			function handlePointClick(event) {
				document.getElementById('lat').value = event.latLng.lat();
				document.getElementById('lng').value = event.latLng.lng();
				document.getElementById('add').click();
			}
		</script>
    
        <img src="resources/images/forest1.jpg" class="bg" />
                
        <div id="content">
            <center>
            
			<h:form id="map" prependId="false" style="margin: 0px; padding: 0px;">
                <div class="shadowed">
                <!-- onPointClick="handlePointClick(event);" -->
						<p:gmap center="#{mapBean.center}" zoom="#{mapBean.zoom}" 
								type="ROADMAP"  model="#{mapBean.mapModel}" style="margin: 0; padding: 0;width:1100px; height:620px">
			        		<!-- <p:ajax event="markerDrag" listener="#{mapBean.onMarkerDrag}" update="map"/>  --> 
			        		<p:ajax event="markerDrag" listener="#{mapBean.onMarkerDrag}" update="growl" />  
			        		
			    		</p:gmap>
				 </div>
                 <p:growl id="growl" showDetail="true" sticky="true" />
                </h:form>
            </center>
        </div>
    </h:body>
</html>
